<template>
    <div>
<h3>房号修改</h3>
<table class="table table-bordered">
    <tbody>
        <tr>
            <td>房型名称</td>
            <td>
                <select v-model="queryInfo.TypeName">
                    <option :value="0">全部房型</option>
                    <option v-for="item in Free" :value="item.RoomId">{{item .RoomName}}</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>房号</td>
            <td>
                <input type="text" v-model="queryInfo.NubCard"/>
            </td>
        </tr>
        <tr>
            <td>状态</td>
            <td>
                <input type="radio" name="stage" :value="1" v-model="queryInfo.NubStage"/>上架
                <input type="radio" name="stage" :value="0" v-model="queryInfo.NubStage"/>下架
            </td>
        </tr>
        <tr>
            <td>备注</td>
            <td>
                <textarea v-model="queryInfo.NubSay"></textarea>
            </td>
        </tr>
        <tr>
            <td>
                <input type="button" class="btn btn-primary" value="提交" @click="AddInsert"/>
            </td>
            <td></td>
        </tr>
    </tbody>
</table>
    </div>
</template>

<script setup lang="ts">
import { ref,reactive,onMounted } from 'vue';
import { useRouter,useRoute } from 'vue-router';
import axios from 'axios';
import moment from 'moment';
const Router=useRouter();
const Route=useRoute();
onMounted(()=>{
    TypeShow();
    EditShow();
})
let queryInfo=reactive({
    NubId:Route.query.id,
    TypeName:0,
    NubCard:'',
    NubSay:'',
    NubStage:1
})
let Free:any=ref([])
///绑定房型下拉框
const TypeShow=()=>{
    axios({
    url:'/api/Type/SelectShow',
    method:'get',
    })
    .then((res)=>{
        console.log(res.data);
        Free.value=res.data
    })
    .catch((err)=>{
        console.log(err)
    })
}
///房号添加
const AddInsert=()=>{
    if(queryInfo.NubCard==''){
        alert("房号不能为空！")
        return;
    }
    if(queryInfo.NubSay==''){
        alert("备注不能为空！")
        return;
    }
    axios({
    url:'/api/Nub/EditNub',
    method:'put',
    data:queryInfo
    })
    .then((res)=>{
        console.log(res.data);
        if(res.data==-1){
            alert("房号重复，请重新提交！")
            return
        }
        if(res.data==1){
            alert("修改成功！");
            Router.push('/nuberlist')
        }
    })
    .catch((err)=>{
        console.log(err)
    })
}
const EditShow=()=>{
    axios({
        url:'/api/Nub/FirstOnly',
        method:'get',
        params:{
            NubId:Route.query.id
        }
    })
    .then((res)=>{
        console.log(res.data);
        queryInfo.TypeName=res.data.TypeName;
        queryInfo.NubCard=res.data.NubCard;
        queryInfo.NubSay=res.data.NubSay;
        queryInfo.NubStage=res.data.NubStage;
    })
    .catch((err)=>{
        console.log(err)
    })
}
</script>

<style scoped>

</style>